You can also add animation to the Pie Chart. This will allow the user to tap or click a pie slice, causing it to spin to the top and display the value in a common TextBlock control.
Complete the following steps:
- Click between the <Grid> </Grid> tags in MainPage.xaml and insert the following XAML markup :
| XAML |
Copy Code
|
<Chart:C1ChartName="chart"Palette="Flow"Grid.Row="1"Margin="0 10 0 0" />
<StackPanelVerticalAlignment="Top"x:Name="panelLabel"Visibility="Collapsed">
<PolygonFill="#C0000000"Margin="0 0 0 -113"HorizontalAlignment="Center"
Points="0 50 20 0 40 50"Width="40"Height="50"RenderTransformOrigin="0.5,0.5" >
<Polygon.RenderTransform>
<CompositeTransformRotation="180"/>
</Polygon.RenderTransform>
</Polygon>
<BorderCornerRadius="10"Padding="20 4"Margin="0 0 0 -10"Background="#C0000000"Width="200">
<StackPanelOrientation="Horizontal"HorizontalAlignment="Center">
<TextBlockx:Name="txtName"FontSize="20"Foreground="White"/>
<TextBlockText=": "FontSize="20"Foreground="White"/>
<TextBlockx:Name="txtPopulation"FontSize="20"Foreground="White"/>
</StackPanel>
</Border>
</StackPanel>
|
- Right-click the page and select View | Code to switch to code view. Add the following namespace to your application:
| C# |
Copy Code
|
using C1.Xaml.Chart;
|
- Edit your page's constructor so it resembles the following:
| C# |
Copy Code
|
public PieAnimation()
{
this.InitializeComponent();
var ds = new DataSeries() { ValuesSource = new double[] { 1, 2, 3, 4 } };
ds.PlotElementLoaded += new EventHandler(ds_PlotElementLoaded);
chart.ManipulationMode = ManipulationModes.All;
chart.Data.Children.Add(ds);
chart.ChartType = ChartType.Pie;
chart.Data.ItemNames = new string[] { "USA", "China", "Russia", "Japan" };
//RunAnimation(this, "StartingAngle", TimeSpan.FromSeconds(0.5), StartingAngle - 0);
}
|